/*
 * @Author: xiaosihan 
 * @Date: 2021-05-05 18:43:30 
 * @Last Modified by: xiaosihan
 * @Last Modified time: 2021-10-25 22:14:26
 */

import ReactMixinComponent from "@ReactMixinComponent";
import React from "react";
import { Points } from "xsh-react-three";
import MyController from "../MyController/MyController";
import map from "./reactIcon.png";


interface Props { }

interface State { }

export default class PointsDemo extends ReactMixinComponent<Props, State> {
    constructor(props: Props) {
        super(props);
        this.state = {};
    }

    render() {
        return (
            <>
                {/* 控制器和相机 */}
                <MyController />

                <Points
                    map={map}
                    size={1}
                    points={[[0, 0, 0], [1, 1, 1], [2, 2, 2], [3, 3, 3], [4, 4, 4], [5, 5, 5]]}
                    sizeAttenuation={true}
                    blending={true}
                    color={"#fff"}

                    alphaMap={undefined}
                    alphaTest={0.1}

                    depthTest={true}
                    depthWrite={true}

                    opacity={1}
                    renderOrder={10}

                    cursor="pointer"
                    onClick={e => {
                        console.log(e);
                    }}

                    glow_enable={true}
                    glow_visibleColor={"#f00"}
                    glow_blurWidth={1}

                />
            </>
        )
    }
}